PHP 当中有许多很有用的魔术变量, 比如__CLASS__
, __METHOD__
之类. 但是typescript中并没有. 因此我写了一个插件typescript-magic-variable-plugin
来使用它们, 源代码已经放到了GitHub上: https://github.com/acrazing/t....
使用方法
- 首先你需要安装这个包:
npm install -D typescript-magic-variable-plugin
-
修改一下你的tsconfig:
{ "compilerOptions": { "plugins": [ { "transform": "typescript-magic-variable-plugin" } ] }, "include": [ // ... "./node_modules/typescript/magic-variable-plugin/types/globals.d.ts" ] }
-
在代码中使用魔术变量, 比如:
export class Foo { constructor() { console.log(__CLASS__) } }
- 用
ttypescript
来编译你的项目, 注意这里不能用typescript
, 因为没有开放transform
接口, 需要全局安装一下ttypescript
:npm i -g ttypescript
, 然后调用ttsc
来编译.
进阶
-
也可以在webpack中使用:
const { createMagicVariableTransformer } = require('typescript-magic-variable-plugin') // ... rules: [ { test: /\.tsx?$/, loader: 'awesome-typescript-loader', options: { // ... other loader's options getCustomTransformers: program => ({ before: [ createMagicVariableTransformer(program, {}) ] }) } } ]
-
目前支持的变量:
name type description __NAMESPACE__
string
the full name of the current namespace, use .
to join the parents__CLASS__
string
the class name of the declaring class __METHOD__
string
the method name of the declaring method __FUNCTION__
string
the function name of the declaring function __DIR__
string
the current directory of the code __FILE__
string
the current file full name of the code __LINE__
number
the current line number -
可以自动给React的组件添加
displayName
属性, 默认开启, 比如:export class Foo extends Component {}
会自动给
Foo
增加静态属性:Foo.displayName = "Foo"
-
配置:
interface Options { addDisplayName: boolean; // 是否给react组件添加displayName属性, 默认开启 rootDir: string; // __DIR__的相对路径, 默认为tscofnig.json中的rootDir或者当前文件夹 }
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。